<template>
  <div class="content-box">
    <a-layout-content class="u-content">
      <!-- <a-breadcrumb class="u-breadcrumb">
      <a-breadcrumb-item href=""> </a-breadcrumb-item>
    </a-breadcrumb> -->
      {{ content }}
    </a-layout-content>
  </div>
</template>

<script>
import { onMounted, ref } from 'vue';
import { Breadcrumb } from 'ant-design-vue';
import { Layout } from 'ant-design-vue';

export default {
  name: 'Content',
  setup() {
    let content = ref('');
    let breadcrumb = ref([]);
    onMounted(() => {
      content.value = window.location.href;
    });
    return {
      content,
      breadcrumb
    };
  },
  components: {
    [Breadcrumb.name]: Breadcrumb,
    [Layout.Content.name]: Layout.Content
  }
};
</script>

<style scoped lang="scss">
.content-box {
  padding: 10px 20px;
}
.u-content {
  width: 100%;
  height: 100%;
  background: #fff;
  min-height: 280px;
  border-radius: 8px;
  margin-top: 12px;
  padding: 20px 32px;
}
</style>
